<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        const list = [
            { id: '1001', manager: '管理员', name: '行政部', pid: '' },
            { id: '1002', manager: '管理员', name: '财务部', pid: '' },
            { id: '1003', manager: '管理员', name: '人事部', pid: '' },
            { id: '1004', manager: '巴斯慧', name: '上海事业部', pid: '1001' },
            { id: '1005', manager: '孙财', name: '财务核算部', pid: '1002' },
            { id: '1006', manager: '张飞', name: '税务管理部', pid: '1002' }
        ]

        // 最终的树结构数据
        // [
        //     { id: '1001', manager: '管理员', name: '行政部', pid: '' ,  children:
        //      [
        //         { id: '1004', manager: '巴斯慧', name: '上海事业部', pid: '1001' ,children:[] }
        //      ]
        //     },
        //     { id: '1002', manager: '管理员', name: '财务部', pid: '' ,children:
        //      [
        //         { id: '1005', manager: '孙财', name: '财务核算部', pid: '1002' ,children:[]},
        //         { id: '1006', manager: '张飞', name: '税务管理部', pid: '1002' ,children:[]}
        //      ]
        //     },
        //     { id: '1003', manager: '管理员', name: '人事部', pid: '' ,children:[]}   
        // ]
        // 建立映射关系 对象
        // const map = {}
        // list.forEach(item => {
        //     // 给每一项添加 children属性的空数组
        //     item.children = []
        //     // 给每个对象以id为名映射所对应的对象
        //     map[item.id] = item
        // })
        // console.log(map)
        // const treeList = []
        // // 遍历改变层级关系
        // list.forEach(item => {
        //     if (item.pid) {
        //         // pid不为空 则是2级目录
        //         // 根据 pid找到对应的 id相同的父级对象
        //         const a = map[item.pid]
        //         // 再添加至父级对象的children 数组内, 形成树形嵌套
        //         a.children.push(item)
        //     } else {
        //         // pid为空 一级目录
        //         treeList.push(item)
        //     }
        // })
        // console.log('treeList', treeList)
        function tranListTotreeList(list) {
            const map = {}
            list.forEach(item => {
                // 给每一项添加 children属性的空数组
                item.children = []
                // 给每个对象以id为名映射所对应的对象
                map[item.id] = item
            })
            // console.log(map)
            const treeList = []
            // 遍历改变层级关系
            list.forEach(item => {
                // 根据 pid找到对应的 id相同的父级对象
                const a = map[item.pid]
                if (a) {
                    // pid不为空 则是2级目录
                    
                    // 再添加至父级对象的children 数组内, 形成树形嵌套
                    a.children.push(item)
                } else {
                    // pid为空 或与映射数据不一致 为一级目录
                    treeList.push(item)
                }
            })
            console.log(treeList)
            return treeList
        }
        tranListTotreeList(list)
        
    </script>
</body>

</html>